<!DOCTYPE html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>校园破冰交友与失物招领平台-失物招领</title>
    <link rel="stylesheet" type="text/css" href="../assets/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="../assets/fonts/line-icons.css">
    <link rel="stylesheet" type="text/css" href="../assets/css/main.css">
    <link rel="stylesheet" type="text/css" href="../assets/css/responsive.css">
	<link rel="stylesheet" type="text/css" href="../assets/css/photo-zoom.css">
</head>
<body style="overflow: auto;">
<div class="container-fluid">
	<div class="breadcrumb-wrapper row">
		<div class="col-12 col-lg-3 col-md-6">
			<h4 class="page-title">我的失物招领</h4>
		</div>
		<div class="col-12 col-lg-9 col-md-6">
			<ol class="breadcrumb float-right">
				<li class="active">失物招领管理</li>
				<li class="active"> / 我的失物招领</li>
			</ol>
		</div>
	</div>
</div>
<div class="container-fluid">
	<div class="row">
		<div class="col-12">
			<div class="card">
				<div class="card-body">
					<form class="form-inline">
						<label>查找物品：</label>
						<input type="text" class="form-control mb-2 mr-sm-2" id="findTitle" placeholder="标题"/>
						<input type="text" class="form-control mb-2 mr-sm-2" id="findIntroduce" placeholder="描述"/>
						<input type="text" class="form-control mb-2 mr-sm-2" id="findUsername" placeholder="发布者"/>
						<input type="text" class="form-control mb-2 mr-sm-2" id="findTime" placeholder="最后修改时间"/>
						<input type="button" class="btn btn-success" id="findLost" value="查找">
					</form>
				</div>
			</div>
		</div>
	</div>
</div>
<div class="container-fluid">
	<div class="row" id="lost">
		
	</div>
</div>
<div class="dialog-bg" id="dialog-bg">
	<div class="img-box" id="img-box">
		<img src="">
	</div>
</div>
<script src="../assets/js/jquery-min.js"></script>
<script src="../assets/js/bootstrap.min.js"></script>
<script>
    //项目根路径
    var ctx = window.parent.ctx;
	var user = window.parent.user;
	var par = $("body");
	var pheight = $(window.parent.document).find(".main-content").height();
	var lostList = new Array();
    
	$(function(){
		$.ajax({
			type: "post",
			url: ctx+"/lostInfo/findAuditLost",
			xhrFields: {
				withCredentials: true
			},
			data: {isPass: '0'},
			success: function(data){
				lostList = data;
				for(var i=0;i<data.length;i++){
					var temp = "<div class='col-md-12 col-xl-4'><div class='card text-center'><img class='img-fluid img-select' src='"+data[i].image+"' alt='' />"+
					"<div class='card-body'><h5 class='card-title'>"+data[i].title+"</h5><p class='card-text'>"+data[i].introduce+"</p><p class='card-text'>"+
					"发布者账号："+data[i].user.username+"</p><p class='card-text'><small class='text-muted'>最后修改于"+window.parent.NowTime(data[i].releaseTime)+
					"</small></p><input type='button' class='btn btn-success' value='通过' onclick='isPass("+i+","+'1'+")'/><span> </span>"+
					"<input type='button' class='btn btn-danger' value='不通过' onclick='isPass("+i+","+'2'+")'/></div></div></div>";
					$("#lost").append(temp);
				}
				// 父页面自适应子页面高度
				par.height(pheight);
				
				//无论点击哪一个img弹出层都会展示相应的图片。
				$(".container-fluid").find("img").on("click",function () {
					$(this).each(function () {
						var $this = $(this);
						var $img = $this.attr("src");//获取当前点击img的src的值
						$("#img-box").find("img").attr("src",$img);//将获取的当前点击img的src赋值到弹出层的图片的src
						$("#dialog-bg").show();//弹出层显示
					});
				});
					 
				//弹出层隐藏
				$("#dialog-bg").on("click",function () {
					$(this).hide();//
				});
			}
		})
		
		$("#findLost").click(function(){
			var jsonStr = {"title":$("#findTitle").val(),"introduce":$("#findIntroduce").val(),"user":{"username":$("#findUsername").val()},"isPass":'0'}
			$.ajax({
				type: "post",
				url: ctx+"/lostInfo/findByEntity",
				data: JSON.stringify(jsonStr),
				contentType: "application/json",
				success: function(data){
					$("#lost").empty();
					lostList = data;
					for(var i=0;i<data.length;i++){
						var temp = "<div class='col-md-12 col-xl-4'><div class='card text-center'><img class='img-fluid img-select' src='"+data[i].image+"' alt='' />"+
						"<div class='card-body'><h5 class='card-title'>"+data[i].title+"</h5><p class='card-text'>"+data[i].introduce+"</p><p class='card-text'>"+
						"发布者账号："+data[i].user.username+"</p><p class='card-text'><small class='text-muted'>最后修改于"+window.parent.NowTime(data[i].releaseTime)+
						"</small></p><input type='button' class='btn btn-success' value='通过' onclick='isPass("+i+","+'1'+")'/><span> </span>"+
						"<input type='button' class='btn btn-danger' value='不通过' onclick='isPass("+i+","+'2'+")'/></div></div></div>";
						$("#lost").append(temp);
					}
					// 父页面自适应子页面高度
					par.height(pheight);
				}
			})
		})
		
	})
	
	function isPass(i,p){
		$.ajax({
			type: "post",
			url: ctx + "/lostInfo/updateAudit",
			data: {id:lostList[i].id,isPass:p},
			xhrFields: {
				withCredentials: true
			},
			success: function(data){
				alert(data);
				window.location.reload();
			},
			error: function(){
				alert("修改失败");
			}
		})
	}
	
</script>
</body>
</html>